<%@ page language="java" contentType="text/html; charset=utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path;
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>Hyves.net - Always in touch with your friends</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<link href="<%=basePath%>/style/main.css" type="text/css"
			rel="stylesheet" />
		<link href="<%=basePath%>/style/style20.css" type="text/css"
			rel="stylesheet" />
		<link href="images/favicon.ico" type="image/x-icon"
			rel="shortcut icon" />
		<link href="<%=basePath%>/style/ie6.css" type="text/css"
			rel="stylesheet" />
		<link href="<%=basePath%>/style/pagination.css" type="text/css"
			rel="stylesheet" />
		<script language="javascript"
			src="<%=basePath%>/script/jquery1.3.2.js" type="text/javascript"></script>
		<script language="javascript"
			src="<%=basePath%>/script/jquery.pagination.js"
			type="text/javascript"></script>
		<script language="javascript" src="<%=basePath%>/editor/xheditor.js"
			type="text/javascript"></script>
		<script language="javascript" type="text/javascript">
			$(document).ready(function(){
				/* 分页插件Pagination */
				var _total_num = $("#total").val();
				var _group_id = $("#groupId").val();
				$("#pagination").pagination(_total_num, {
							items_per_page : 10,
							next_show_always : false,
							prev_show_always : false,
							callback : pageselectCallback
						});
				function pageselectCallback(page_index, jq) {
					$.ajax({
								type : "POST",
								dataType : "html",
								url : "<%=basePath%>/forum/show",
								data : {
									gid : _group_id,
									page_index : page_index,
									maxResult : 10
								},
								success : function(data) {
									$("#forum-reply-list").html(data);
								}
							});
					/* 当页面不在第一页时，隐藏楼主 */
					if(page_index!=0){$("#forum-title").hide();}
				}
				/* 论坛回复的ajax回复提交 */
				$('#forumApplySubmitBtn:a').click(function() {
						/* 防止无内容提交 */
						if($(".xheditor-simple").val()==""){return false;}
						$("#forumApplyForm").ajaxSubmit(forum_reply);
						return false;
					});
				/* ajax更新论坛回复提交 */
				var forum_reply= {
					success : function(data){
						$("#forum-reply-list:last").append(data).fadeIn("slow");
						document.form.reset();
					}
				};
			});
		</script>
	</head>
	<body>

		<jsp:include page="/site/common/header.jsp"></jsp:include>

		<div id="page-con">
			<div id="page-con-hdr">
				<div class="box">
					<div class="groups-header">
						<div class="wrapper w4">
							<div class="section s1"></div>
						</div>
						<div class="wrapper w2">
							<div class="section s1">
								<div id="page-con-info">
									<div class="avatar small">
										<a class="avatar-link" title="${group.name }"
											href="<%=basePath%>/group/view?id=${group.id }"><img
												class="avatar-img mediaicon14" alt="${group.name }"
												src="<%=basePath%>/images/group-header/${group.groupHeader }" />
										</a>
									</div>
									<h1>
										<a href="<%=basePath%>/group/view?id=${group.id }">${group.name
											}</a>
									</h1>
									<!--  (Hyve) -->
									<ul id="profile-menu">
										<li class="first">
											<a href="http://lifestyles.hyves.nl/address/">About</a> |
										</li>
										<li>
											<a href="http://lifestyles.hyves.nl/photos/">Photos</a> |
										</li>
										<li class="current">
											<a href="http://lifestyles.hyves.nl/forum/">Messages</a> |
										</li>
										<li class="last" id="profile-menu-more">
											<a class="sub-menu-title" onclick="return false;"
												href="javascript:void(0);">More</a>
											<div class="sub-menu">
												<div class="sub-menu-bg">
													<div class="sub-menu-bg-pimp">
														<div class="sub-menu-hdr">
															<div class="sub-menu-hdr-bg"></div>
														</div>
														<ul>
															<li class="first">
																<a href="http://lifestyles.hyves.nl/members/">Members</a>
															</li>
															<li>
																<a href="http://lifestyles.hyves.nl/events/">Agenda</a>
															</li>
															<li>
																<a href="http://lifestyles.hyves.nl/polls/">Polls</a>
															</li>
															<li>
																<a href="http://lifestyles.hyves.nl/widget/">Gadgets</a>
															</li>
															<li>
																<a href="http://lifestyles.hyves.nl/blog/">Blogs</a>
															</li>
															<li class="last">
																<a href="http://lifestyles.hyves.nl/minibuzz/">Buzz</a>
															</li>
														</ul>
														<div class="sub-menu-bg-mf-pimp"></div>
													</div>
												</div>
											</div>
										</li>
									</ul>
								</div>
							</div>
							<!-- 
							<div class="section s2">
								<div id="page-con-optns">
									<div>
										<a class="disabled icon icon-lifebelt action-icon-text"
											id="toggle_pimp_off" onclick="return false;"
											href="javascript:void(0);">Show in normal design</a>
									</div>
									<div>
										<a class="icon icon-lifebelt action-icon-text"
											id="toggle_pimp_on" onclick="return false;"
											href="javascript:void(0);">Show personalized design!</a>
									</div>
								</div>
							</div>
							 -->
						</div>
						<div class="wrapper w4">
							<div class="section s1">
								<div class="box" id="tidalboard-google-ad">
									<div class="box-con">
										<div class="box-con-bg"></div>
										<div class="box-con-inner">
											<div id="adsense_f23_box" style="DISPLAY: none">
												<div class="adsbyg">
													Advertenties door Google
													<a href="http://google-feedback.hyves.nl/" target="_blank">?</a>
												</div>
												<div id="adsense_f23_content"></div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="box-con-bg"></div>
				</div>
				<div class="border"></div>
				<div class="bg"></div>
			</div>
			<!-- page-con-hdr -->
			<div id="page-con-body">
				<div class="wrapper w5">
					<div class="section s1">
						<div class="box message-thread">
							<div class="box-hdr">
								<div class="box-hdr-bg"></div>
								<div class="box-hdr-inner">
									<h2>
										<a href="<%=basePath %>/forum/?id=${group.id }">Messages</a> &gt;
										${forum.title }
									</h2>
								</div>
							</div>
							<div class="box-con">
								<div class="box-con-bg"></div>
								<div class="box-con-inner">
									<input id="total" type="hidden" value="${total }" />
									<input id="group_id" type="hidden" value="${groupId }" />
									<!--  title  -->
									<div class="box-con-sctn reaction first" id="forum-title">
										<div class="avatar medium">
											<a class="avatar-link" title="${forum.publisher.nick }"
												href="<%=basePath %>/profile/?id=${forum.publisher.id }"><img
													class="avatar-img" alt="${forum.publisher.nick }"
													src="<%=basePath%>/images/user-header/${forum.publisher.header }" />
											</a>
										</div>
										<div class="reaction-data">
											<a href="<%=basePath %>/profile/?id=${forum.publisher.id }">${forum.publisher.nick
												} (${forum.publisher.userFriendShip.size() })
											</a>
											<div class="box-con-sctn-prop">
												<span class="date" title="${forum.created }">${forum.createdFormat }</span>
											</div>
										</div>
										<div class="reaction-con">
											${forum.content }
										</div>
									</div>
									<div id="forum-reply-list">
										<img alt="Loading..." src="<%=basePath%>/images/loading.gif"></img>
									</div>
									<div id="pagination" class="pagination paging"></div>
									<s:if test="#session.user!=null">
										<div class="box-con-sctn reaction">
											<form name="form" action="<%=basePath %>/forum/reply?id=${forum.id }" method="post" id="forumApplyForm">
												<textarea class="xheditor-simple" name="forumBody.content" rows="12" style="width: 450px"></textarea>
												<br><span class="button primary-button"><span>
													<input id="forumApplySubmitBtn" type="submit" value="回复"/>
												</span></span>	
											</form>			
										</div>
									</s:if>
								</div>
							</div>
						</div>
					</div>
					<!-- section s1 -->
					<!-- 右边开始 -->
					<div class="section s2">
						<div class="box homepage-groups">
							<div class="box-hdr">
								<div class="box-hdr-bg"></div>
								<div class="box-hdr-inner">
									<h2>
										<a href="http://www.hyves.nl/hyves/"><span
											class="box-icon icon icon-group">&nbsp;</span>Popular HYVES</a>
									</h2>
								</div>
							</div>
							<div class="box-con">
								<div class="box-con-bg"></div>
								<div class="box-con-inner">
									<div class="box-con-sctn first">
										<ul class="avatar-list">
											<li class="first">
												<div class="avatar large">
													<a class="avatar-link"
														title="Race Tegen De Klok: 600.000 op 31-12-2009 / Thema deze maand: Games"
														href="http://racetegendeklok.hyves.nl/"><img
															class="avatar-img mediaicon14"
															alt="Race Tegen De Klok: 600.000 op 31-12-2009 / Thema deze maand: Games"
															src="Hyves_net - Always in touch with your friends.files/729017263_14_D4iu.jpg" />
													</a>
													<p class="avatar-name">
														<a href="http://racetegendeklok.hyves.nl/">Race Tegen
															De Klok: 600.000 op 31-12-2009 / Thema deze maand: Games</a>
														(552854)
													</p>
												</div>
											</li>
											<li>
												<div class="avatar large">
													<a class="avatar-link" title="Sesamstraat is Cooll (H)"
														href="http://sesamstraatnaar7.hyves.nl/"><img
															class="avatar-img mediaicon14"
															alt="Sesamstraat is Cooll (H)"
															src="Hyves_net - Always in touch with your friends.files/645767942_14_8RYb.jpg" />
													</a>
													<p class="avatar-name">
														<a href="http://sesamstraatnaar7.hyves.nl/">Sesamstraat
															is Cooll <img title="(h)" alt="(h)"
																src="Hyves_net - Always in touch with your friends.files/smiley_bril.gif"
																border="0" /> </a> (518617)
													</p>
												</div>
											</li>
										</ul>
									</div>
									<div class="more">
										<span class="rsaquo">› </span><a
											href="http://www.hyves.nl/hyves/">More... </a>
									</div>
								</div>
							</div>
						</div>
					</div>
					<!-- section s2 -->
				</div>
				<!-- wrapper w8 -->
				<div class="border"></div>
				<div class="bg"></div>
			</div>
			<!-- page-con-body -->
			<div id="page-con-ftr">
				<div class="border"></div>
				<div class="bg"></div>
			</div>
			<!-- page-con-ftr -->
		</div>

		<jsp:include page="/site/common/footer.jsp"></jsp:include>

	</body>
</html>